<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>右键菜单</title>
	<link rel="stylesheet" href="assets/style.css">
	<link rel="stylesheet" type="text/css" href="http://www.jq22.com/jquery/font-awesome.4.6.0.css">
</head>
<body>

	<div class="box">
	<h3>任意位置右键查看效果</h3>
		<p>1.初始化</p>
		<p>2.配置参数(参数：1.右键响应的区域，2.右键出现的listName,3.每一个右键Item响应的事件)</p>
		<p>3.右键的icon使用的是fontawesome中的图标</p>
	</div>
	<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
	<script src="assets/script.js"></script>
	<script>
		$(document).ready(function(){
			var rcm = window.RMenu;
			rcm.init({
				area:'body',
				items:{
					"edit":{name:"编辑",icon:'edit'},
					"del":{name:"删除",icon:'trash-o'},
					"add":{name:"添加",icon:'plus',items:{
						"new-text":{name:"添加文件",icon:'file-text'},
						"new-zip":{name:"添加ZIP",icon:'file-zip-o'}
					}},
					"refresh":{name:"刷新",icon:'refresh'},
					"down":{name:"下载按钮",icon:'cloud-download'},
					"new":{name:"新建",icon:'file',items:{
						"new-text":{name:"新建文件",icon:'file-text'},
						"new-zip":{name:"新建ZIP",icon:'file-zip-o'}
					}}
				},
				callback:function(res){
					if(res.data == 'edit'){
						console.log('点击了edit');
					}else if(res.data == 'del'){
						console.log('点击了del');
					}else if(res.data == 'add'){
						console.log('点击了add');
					}else if(res.data == 'refresh'){
						window.location.reload();
					}else if(res.data == 'down'){
						console.log('点击了download');
					}
				}
			})
		});

		
	</script>
</body>
</html>